<template>
	<view>
		<!-- 标签列表 -->
		<view class="tags_list">
			
			<!-- 标签子项 -->
			<view class="tag_item" v-for="item in tagsList" @click="$navigateTo({
				url: `/pages/index/tags_manage/add_and_update_tag/index?mode=update&id=${item.id}`
			})">
				<image src="@/static/index/index/tag.png"></image>
				<view class="tag_name">{{item.tagName}}</view>
			</view>
			
			<!-- 添加标签 -->
			<view class="tag_item" @click="$navigateTo({
				url: '/pages/index/tags_manage/add_and_update_tag/index?mode=add'
			})">
				<image src="@/static/index/tags_manage/add.png"></image>
				<view class="tag_name">添加标签</view>
			</view>
			
		</view>


	</view>
</template>

<script>


	export default {

		data() {
			return {  
				tagsList: [],
			};
		},
		onShow() {
			this.getTagList()
		},
		methods: {
			getTagList() {
				this.$http_json({
					url: "/api/tag/list",
					method: "get",
					loading: false,
					params: {
						userId: this.$getMemoryPmt('userInfo').id
					}
				}).then(result => {
					console.log(result)
					this.tagsList = result.data
					// todo
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #FFFFFF;
	}
	
	.tags_list {
		padding-left: 26rpx;
		
		.tag_item {
			display: flex;
			align-items: center;
			padding: 34rpx 0;
			border-bottom: 2rpx solid #F3F3F3;
			
			image {
				width: 40rpx;
				height: 40rpx;
			}
			
			.tag_name {
				margin-left: 28rpx;
				font-size: 26rpx;
			}
		}
		
		.tag_item:last-child {
			border-bottom: none;
		}
	}
</style>
